import React from 'react';
import {Row, Col , Menu , Icon,} from 'antd';
import '../public/style/components/header.css';


const Header = () => (
    <div class= 'header'>
       <Row type = 'flex' justify = 'center'>
          <Col xs={24} sm= {24} md={10} lg={15} xl={12}>
              <span className= 'header-logo'>宋工</span>
              &nbsp;&nbsp;
              <span className= 'header-text'>兴趣是最好的老师</span>
          </Col>
          <Col className = 'menu-div' xs={0} sm= {0} md={14} lg={8} xl={6}>
             <Menu  mode = 'horizontal'>
                 <Menu.Item key = 'home'>
                     <Icon  type = 'home' />
                        首页
                 </Menu.Item>
                 <Menu.Item key = 'video'>
                     <Icon  type = 'youtube' />
                        视频
                 </Menu.Item>
                 <Menu.Item key = 'life'>
                     <Icon  type = 'smile' />
                        生活
                 </Menu.Item>
             </Menu>
          </Col>
       </Row>
    </div>
)

export default Header